<template>
	<div class="mobile">
		<div class="nav-top">
			<div class="left">
				<router-link to="/portal/netm"><img src="../../../assets/img/phone-back.png" alt=""></router-link>
			</div>
			<div class="right">
				<span>代表履职</span>
				<img src="../../../assets/img/phone-more.png" alt="">
			</div>

		</div>
		<div class="trends-form">
			<div class="form-detail">
				<div class="input3">
					<span>履职类型</span>
					<select>
						<option value="1">建议</option>
						<option value="2">调研</option>
						<option value="3">公益</option>
						<option value="4">选举</option>
					</select>
				</div>
				<div class="input3">
					<span>履职标题</span>
					<input type="text" placeholder="请输入标题" v-model="title">
				</div>
				<div class="input3">
					<span>履职日期</span>
					<el-date-picker clearable v-model="startDate" type="date" value-format="yyyy-MM-dd"
						placeholder="请输入履职日期">
					</el-date-picker>
				</div>
				<div class="input3">
					<span>履职地点</span>
					<input type="text" placeholder="请输入地点" v-model="location">
				</div>
				<div class="warning"><img src="../../../assets/img/warning.png"
						alt="">服务时长由社区党组织根据服务内容设置时长，一般为1-4小时，也可自定义设置时长。</div>
				<div class="input4">
					<div class="name">
						服务内容
						<div class="num">{{description.length}}/2000</div>
					</div>
					<div class="text-cont">
						<editor v-model="description" placeholder="您可以对服务内容进行简要描述" :min-height="300"/>
						<div class="img-list" prop="imageUpload">
							<image-upload v-model="imageUpload" :limit="1" />
						</div>
					</div>
				</div>
				<div class="confirm-btn" @click="confirm()">
					提交
				</div>
			</div>

		</div>
		<div class="trends-nav">
			<div class="item active"><img src="../../../assets/img/phone-icon2.png" alt="">新建纪实</div>
			<div class="item "><router-link to="/portal/net/repreWorkm"><img src="../../../assets/img/phone-icon1.png"
						alt="">历史纪实</router-link></div>
		</div>
	</div>
</template>

<script>
import { addRepWork } from "@/api/website";
export default {
	data() {
		return {
			userInfo: "",
			title: "",
			startDate: "",
			location: "",
			description: "",
			imageUpload: null,
		}
	},
	components: {

	},
	created() {
		this.userInfo = JSON.parse(sessionStorage.getItem("useInfo"))
	},
	mounted() {

	},
	methods: {
		confirm() {
			if (!this.title) {
				this.$modal.msgError("请输入标题");
				return
			}
			if (!this.startDate) {
				this.$modal.msgError("请输入履职日期");
				return
			}
			if (!this.location) {
				this.$modal.msgError("请输入地点");
				return
			}
			if (!this.description) {
				this.$modal.msgError("请输入服务内容");
				return
			}
			addRepWork({
				"representativeId": this.userInfo.id,
				"representativeName": this.username,
				"title": this.title,
				"description": this.description,
				"startDate": this.startDate,
				"location": this.location,
				"imagePath": this.imageUpload,
				"reviewStatus": "待审核"
			}).then(response => {
				this.$router.push('/portal/net/repreWorkm');
			});
		}
	}

};
</script>

<style scoped lang="scss"></style>